<template>
  <div>
    <el-carousel :interval="3000"  height="5.5rem" indicator-position='' id="carousel" >
      <el-carousel-item v-for="i in list" class="slide">
        <img :src="'http://api.ishuhui.com/'+ i.img" alt="">
      </el-carousel-item>
    </el-carousel>
  </div>
</template>
<script>
  let touch = require('../assets/js/touch.js')
  export default {
    props: ['list'],
    methods: {
      // @prev="left"
      left(){
        console.log('左滑动')
      }
    },
   
    mounted() {
     
      touch.touch.on('#carousel', 'swipeleft', function () {
        
        // prev()
        // this.prev()
        // this.left()
      })
    }
  }

</script>
<style>
  .slide img {
    width: 100%;
    height: 5.5rem;
  }
  
  ul li .el-carousel__button {
    width: 5px;
    height: 5px;
    border-radius: 50%;
  }
  
  .is-active button {
    background-color: orange;
  }
  
  .el-carousel__indicators {
    left: 80%;
  }

</style>
